<template>
  <div class="content-header" :class="className">
    <div class="content-head">
      <div class="content-title">{{ title ? title : route.meta.title }}</div>
    </div>
  </div>
</template>
<script setup>
import { useRoute } from "vue-router";
defineProps({
  title: {
    type: String,
    default: null,
  },
  className: {
    type: String,
    default: null,
  },
});
const route = useRoute();
</script>
<style scoped>
.content-head {
  width: 100%;
  padding: 5px 0 14px 0px;
  border-bottom: 1px solid #eef1f5;
  margin-bottom: 20px;
}

.content-head .content-title {
  position: relative;
  font-size: 15px;
}

.content-head .content-title::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 16px;
  top: 4px;
  left: -15px;
}
</style>
